<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>API 视图</title>
  <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
    <style>
        .hr1{
            height: 5px;border:none;border-top:5px dashed rebeccapurple;
            width: 80%;
        }
        .hr2{
            height: 5px;border:none;border-top:5px dashed green;width: 80%;
        }
        .fontTr{
            color: brown;
            font-weight: bold;
        }
    </style>
</head>
<body>
 <div id="content"></div>
</body>
<script>
  $(function (){
      debugger;
    var url = window.location.href;
    var urlPre =  url.split("?")[0];
    var platform =  url.split("?")[1];
    $.get(urlPre+"Data?"+platform,function (list){
       $("#content").html("");
       var table = $("<table width='100%' style='border-collapse: collapse'></table>")
       var  head = $("<tr></tr><th>url</th>" +
           "<th>描述</th></tr>")
       table.append(head);
        if(list && list.length>0){
            for (var i = 0; i < list.length; i++) {
                 var obj = list[i];
                 if(i%2==0) {
                     table.append($("<tr><td><hr class='hr1'/></td><td><hr class='hr1' /></td></tr>"))
                 }else{
                     table.append($("<tr><td><hr class='hr2'/></td><td><hr class='hr2' /></td></tr>"))
                 }
                table.append($("<tr class='fontTr' ><td  align='center'>"+obj[0]+"</td>" +
                    "<td  align='center'>"+obj[1]+"</td></tr"))

            }
            if(i%2==0) {
                table.append($("<tr><td><hr class='hr1'/></td><td><hr class='hr1' /></td></tr>"))
            }else{
                table.append($("<tr><td><hr class='hr2'/></td><td><hr class='hr2' /></td></tr>"))
            }
        }
        $("#content").append(table);
    })
  });
</script>
</html>